<template>
  <component :is="view.type" v-bind="view.attrs" class=" pg-w-[100%]">
    <Tabs name="record" v-model="tabname" type="card" @on-click="changeTabs">
      <TabPane tab="record" label="进行中" name="进行中" context-menu>
        <pg-table :data="dataSet.tableData"></pg-table>
      </TabPane>
      <TabPane tab="record" label="已完成" name="已完成" context-menu>
        <pg-table :data="dataSet.tableData"></pg-table>
      </TabPane>
      <TabPane tab="record" label="form" name="form" context-menu>
        <pg-form :data="dataSet.formData"></pg-form>
      </TabPane>
    </Tabs>
    <pg-modal></pg-modal>
  </component>
</template>

<script>
import PgTable from './pg-table.vue';
import ancMixin from './ancMixin'
import PgForm from './pg-form.vue';
import PgTree from './pg-tree.vue';
import PgModal from './pg-modal.vue';
export default {
  name:'',
  components: {PgTable, PgForm, PgTree, PgModal},
  mixins:[ancMixin],
  data() {
    return {
      tabname:"进行中"
    };
  },
  props: {},
  watch: {},
  computed: {
    view(){
      return {
        type:['starGenView','starTwoView','starThreeView'][0],
        attrs:{
          left:12,
          right:12,
          middle:0,
          minLeftHeight:'600px',
          title:{
              "en-US":'abc',
              "zh-CN": 'abc'
          }[this.G_Locale],
          fontStyle:{
              
          }
        }
      }
    }
  },
  created() {},
  mounted() {},
  methods: {
    changeTabs(name) {
      console.log(name);
    }
  }
};
</script>
<style scoped>
</style>